<template>
  <div id="app">
    <TopBar></TopBar>
    <Header></Header>
    <router-view />
    <Footer></Footer>
  </div>
</template>
<script>
import Header from "@/components/Header.vue";
import TopBar from "@/components/TopBar.vue";
import Footer from "@/components/Footer.vue";
// import axios from "@/request/request.js";
// import { jingpinAPI } from "@/request/api.js"; //只使用接口部分引入使用{}

export default {
  components: { Header, TopBar, Footer },
  data() {
    return {};
  },
  // async created() {
  // axios直接书写缺点:
  // 1.url一样 每个都要改; --- request.js
  // 2.接口地址变化都要改; --- api.js
  // 3.每次都需要手动编写config,携带token(多个组件携带相同token)
  // 优化then()写法,async+await

  // 格式:axios.get(url,[,config])
  // axios.get("/products/recommend").then((res) => {
  // jingpinAPI().then(
  //   (res) => {
  //     console.log("res2:", res);
  //   },
  //   (err) => {
  //     console.log(err);
  //   }
  // );

  // 异步代码同步化--写法变为变量
  //   let res = await jingpinAPI();
  //   console.log("res:", res);
  // },
};
</script>

<style lang="less">
// #app {
//   background: #f5f5f5;
// }
</style>
